var Map = $.Class.create({
		
	_default : '#map',
	_lat : -32.950741,
	_lng : -60.6665,
	_zoom : 13,
	_markers : Array(),
	
	// constructor		
	initialize : function(options) {
		if (!options) var options = {};		
		if (!options.map) options.map = $(this._default);
		this._map = options.map;
		if (!options.mapOptions) options.mapOptions = {
			'center': new google.maps.LatLng(this._lat, this._lng),
			'zoom': this._zoom,			
		};						
		options.mapOptions.callback = this.mapLoaded(this._map);
		options.map.gmap(options.mapOptions);		
	},
	
	mapLoaded : function(myMap) {
		self = this;
		var url = '/property/load/format/json';
        $.getJSON(url, '', function(data) { 
            // We create a marker for each property we get from the backend
            $.each( data.markers, function(i, m) {            	            	
        		myMap.gmap('addMarker', {
        			'id' : m.id,
            		'position': new google.maps.LatLng(m.lat, m.lng)            		
            	}, function(map, marker) {
            		 
            		self._markers.push(marker);
            		// When the marker is clicked we will call this callback
            		$(marker).click(function() { self.iwCallback(map, marker, m); } );
            	})	            
            });
            
            // Quizas es mejor usar un markerCluster
            //var markerCluster = new MarkerClusterer(myMap, markers);
            //var markerCluster = new MarkerClusterer($('#map_canvas').gmap('getMap'), $('#map_canvas').gmap('getMarkers'));
            
            // We create only one InfoWindow and then we will move it around the markers
            myMap.gmap('addInfoWindow', {}, function(iw) { self._iw = iw; } );
            $('#submitSearch').click(function() { self.search(); return false; } )
        });
        
	},
	
	search : function() {
		var url = "/property/search/format/json";
		self = this;
		$.ajax({
			type: "POST",
			url: url,
			data: 'location=' + $('#location').val() + '&type=' + $('#type').val() + '&operation=' + $('#operation').val() +
				'&fromPrice=' + $('#fromPrice').val() + '&toPrice=' + $('#toPrice').val() + '&currency=' + $('input[name=currency]:checked').val(),
			dataType: "json",
			//beforeSend: options.beforeSend,			
			//error: options.error,
		 	complete: function(jqXHR, textStatus) {
		 		var data = $.parseJSON(jqXHR.responseText);		 		
	            $.each( self._markers, function(i, marker) { 
	            	marker.setVisible(false); 
	            });
		 		$.each( data.markers, function(i, m) {
	            	self._map.gmap('findMarker', 'id', m.id, function(found, marker) {	            		
	                    if (found) marker.setVisible(true);	            		
	            	});	                       	            		            		            	            	
	            });		 		
		 	}
		});		
	},
	
	iwCallback : function(map, marker, m) {
		var iw = this.getIW();
		iw.setPosition = marker.getPosition();		
		iw.open(map, marker);
		map.panTo(marker.getPosition());
		var content = $.cookie("property" + m.id);
		if (!content) { 
			var url = "/property/marker/format/json";
			self = this;
			$.ajax({
				type: "POST",
				url: url,
				data: 'id=' + m.id,
				dataType: "json",
				//beforeSend: options.beforeSend,			
				//error: options.error,
			 	complete: function(jqXHR, textStatus) { 
			 		var property = $.parseJSON(jqXHR.responseText);
			 		content = '<p>' + property.desc + '</p><br /><p><button onclick="javascript:location.href=\'/property/index/id/' + property.id + '\'">M&aacute;s informaci&oacute;n</button><p>' 
			 		iw.setContent(content);
			 		//$.cookie("property" + m.id, content, {path: '/'} );
			 	}
			});
		} else {
			iw.setContent(content);
		}
	},
	
	getIW : function() { return this._iw }
	
}, {
	
	// properties
	getset : [
	          [ 'lat', '_lat' ],
	          [ 'lng', '_lng' ],
	          [ 'zoom', '_zoom' ],
	          [ 'map', '_map' ],
	          [ 'default', '_default' ],
	          [ 'callback', '_callback' ],
	          [ 'iw', '_iw' ],
	          [ 'marker', '_markers' ]
	]
});